<template>
  <div class="column"></div>
</template>
<script>
export default {
  name: "column",
  data() {
    return {};
  },
  mounted() {
    this.setup();
  },
  methods: {
    setup() {
      let column = this.$echarts.init(this.$el);
      let option = {
          title:{
              show:true,
              text:"高级英语统计图"
          },
        xAxis: {
          data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
        },
        yAxis: {},
        series: [
          {
            type: "bar",
            data: [23, 24, 18, 25, 27, 28, 25],
            emphasis: {
              label: {
                show: true,
                formatter: "{b}:{c}",
                position: [70, 10],
                width: 100,
                height: 40,
                color: "#fff",
                backgroundColor: "rgba(0, 0, 0, 0.81)",
                verticalAlign: "middle",
                align: "center",
              },
            },
          },
        ],
      };
      column.setOption(option);
    },
  },
};
</script>
<style scoped>
.column {
  width: 300px;
  height: 300px;
}
</style>